{{yield}}

{{#if isShowingAvatars}}
  {{#avatars/avatars-detail
      header=header
      onClose=(action "dismissAvatars")}}

    <ul class="avatar-detail-container">
      {{#each avatars as |avatar|}}
        <li class="avatar-detail">

          <div class="avatar-detail__entity">
            <img src="{{avatar.imageUrl}}" alt="{{avatar.name}}" class="avatar">
          </div>

          {{#avatars/avatar-metadata class="avatar-detail__meta" avatar=avatar as |aviMeta|}}
            <h4>{{aviMeta.name}}</h4>

            {{#if aviMeta.email}}
              <a href="mailto:{{aviMeta.email}}" class="avatar-meta-action" target="_blank">
                <strong><i class="fa fa-at"></i></strong> {{aviMeta.email}}
              </a>
            {{/if}}

            {{#if aviMeta.userName}}
              <a href="slack://user?team={{aviMeta.team}}&id={{aviMeta.userName}}" class="avatar-meta-action">
                <i class="fa fa-slack"></i> {{aviMeta.userName}}
              </a>
            {{/if}}
          {{/avatars/avatar-metadata}}

        </li>
      {{/each}}
    </ul>

  {{/avatars/avatars-detail}}
{{/if}}